<template>
	<view>
		<view class="content">
			<view class="content-detail">
				<text class="one">联系人</text>
				<input type="text" placeholder="姓名" v-model="adderssInformation.name">
			</view>
			<view class="content-detail">
				<view class="female" @tap="getfemale" v-if="female" >
					女士
				</view>
				<view class="isfemale" @tap="isfemale" v-else value="女" v-model="adderssInformation.sex">
					女士
				</view>
				<view class="sir" @tap="getsir" v-if="sir">
					先生
				</view>
				<view class="issir" @tap="issir" v-else value="男" v-model="adderssInformation.sex" >
					先生
				</view>
				
			</view>
			<view class="content-detail">
				<text class="one">电话</text>
				<input type="text" placeholder="联系人电话" v-model="adderssInformation.phoneNumber">
				
			</view>
			<view class="content-detail">
				<text class="one">地址</text>
				<input type="text" placeholder="请选择送餐地址>" v-model="adderssInformation.detail" @click="getLocation">
				
			</view>
			<view class="content-detail">
				<text class="one">详细地址</text>
				<input type="text" placeholder="例如：16号楼427室">
				
			</view>
		</view>
		<view class="button" @click="address">
			确定
		</view>
	</view>
</template>

<script>
	import {addAddress} from "@/api/home.js"
	export default {
		data() {
			return {
				sir:true,
				female:true,
				adderssInformation:{
					name:'',
					sex:'',
					sexnv:"女",
					sexnv:"男",
					phoneNumber:'',
					longitude:'',
					latitude:'',
					address:'',
					detail:'',
					
				},
				//定位
				qqmapsdk: {},
				provinces: '', //省份
				city: '', //城市
				county: '',
			}
		},
		methods:{
			
			//新增收餐地址
			address(){
				addAddress(this.adderssInformation).then(res=>{
					console.log("fff",res);
				})
			},
			//女士
			getfemale(){
				// console.log(kk);
				this.female=false
				this.adderssInformation.sex = '女'
				if(this.sir == false){
					this.sir = true
				}
			},
			isfemale(){
				this.female = true
				
				console.log(this.adderssInformation.sex);
			},
			getsir(){
				this.sir = false
				this.adderssInformation.sex = '男'
				if(this.female == false){
					this.female=true
				}
			},
			issir(){
				this.sir = true
				
				// console.log(this.issir());
				// let a = document.getElementsByClassName('issir');
				// console.log(a);
			},
			//男士
			// fff(){
			// 	//同步
			// 	uni.setStorage({
			// 		key:'YY',
					
			// 		data:this.XXX,
					
			// 	})
				
			// 	uni.getStorage({
			// 		key:'YY',
			// 	})
			// 	//一部
			// 	uni.setStorageSync()
			// }
			//定位
			getLocation() {
				let jing = this
				let wei = this
				let dizhi = this
				// uni.getLocation({
				// 	type: 'wgs84',
				// 	success: function(res) {
				// 		console.log('当前位置的经度：' + res.longitude);
				// 		console.log('当前位置的纬度：' + res.latitude);
				// 	},
				// 	fail(err) {
				// 		console.log('位置获取失败', err);
				// 	}
				// });
			
				wx.getSetting({
					success: (res) => {
						console.log(JSON.stringify(res))
						// res.authSetting['scope.userLocation'] == undefined  表示 初始化进入该页面
						// res.authSetting['scope.userLocation'] == false  表示 非初始化进入该页面,且未授权
						// res.authSetting['scope.userLocation'] == true  表示 地理位置授权
						if (res.authSetting['scope.userLocation'] != undefined && res.authSetting[
								'scope.userLocation'] != true) {
							wx.showModal({
								title: '请求授权当前位置',
								content: '需要获取您的地理位置，请确认授权',
								success: function(res) {
									if (res.cancel) {
										wx.showToast({
											title: '拒绝授权',
											icon: 'none',
											duration: 1000
										})
									} else {
										wx.openSetting({
											success: function(dataAu) {
												if (dataAu.authSetting[
														"scope.userLocation"] ==
													true) {
													wx.showToast({
														title: '授权成功',
														icon: 'success',
														duration: 1000
													})
													//再次授权，调用wx.getLocation的API
												} else {
													wx.showToast({
														title: '授权失败',
														icon: 'none',
														duration: 1000
													})
												}
											}
										})
									}
								}
							})
						} else {
							uni.getLocation({
								type: 'wgs84',
								success: function(res) {
									console.log('当前位置的经度：' + res.longitude);
									console.log('当前位置的纬度：' + res.latitude);
									jing.adderssInformation.longitude = res.longitude
									wei.adderssInformation.latitude = res.latitude
									uni.request({
										url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' +
											res.latitude + ',' + res.longitude +
											'&key=4KQBZ-W5N36-CJKSF-EQQN4-2OXTZ-V4F5J',
										method: "GET"
									}).then((res) => {
										// console.log('大哥',  res[1].data.result.address);
										dizhi.adderssInformation.address = res[1].data.result.address
										// console.log("kk",that.addressList);
										
									})
								},
								fail(err) {
									console.log('位置获取失败', err);
								}
							})
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		height: 460rpx;
		width: 100%;
		background-color: #FFFFFF;
		display: flex;
		flex-direction: column;
		.content-detail{
			width: 680rpx;
			// background-color: aqua;
			margin-left: 28rpx;
			height: 92rpx;
			display: flex;
			justify-content: space-between;
			// border-top: 1rpx solid #BFBFBF;
			.one{
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 92rpx;
				text-align: center;
				color: #000000;
				
			}
			input{
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 92rpx;
				text-align: center;
				color: #BFBFBF;
				margin-right: 0;
				margin-top: 25rpx;
				

			}
			.female{
				width: 136rpx;
				height: 56rpx;
				border: 1px solid #BFBFBF;
				border-radius: 6px;
				margin-left: 380rpx;
				margin-top: 10rpx;
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 56rpx;
				text-align: center;
				color: #BFBFBF;
			}
			.isfemale{
				width: 136rpx;
				height: 56rpx;
				border: 1px solid #FB7A42;
				border-radius: 6px;
				margin-left: 380rpx;
				margin-top: 10rpx;
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 56rpx;
				text-align: center;
				color: #FB7A42;
			}
			.sir{
				width: 136rpx;
				height: 56rpx;
				border: 1px solid #BFBFBF;
				border-radius: 6px;
				// margin-left: 24rpx;
				margin-top: 10rpx;
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 56rpx;
				text-align: center;
				color: #BFBFBF;
			}
			.issir{
				width: 136rpx;
				height: 56rpx;
				border: 1px solid #FB7A42;
				border-radius: 6px;
				// margin-left: 24rpx;
				margin-top: 10rpx;
				font-family: 'PingFang SC';
				font-style: normal;
				font-weight: 400;
				font-size: 28rpx;
				line-height: 56rpx;
				text-align: center;
				color: #FB7A42;
			}
		}
	}
	.button{
		width: 686rpx;
		height: 96rpx;
		background: #FB7A42;
		border-radius: 48rpx;
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 400;
		font-size: 32rpx;
		line-height: 96rpx;
		text-align: center;
		color: #FFFFFF;
		margin-left: 24rpx;
	}
</style>
